<template>
  <div >
    <el-autocomplete v-model="bankStr" ref="autoInput" :fetch-suggestions="getDataList" placeholder="请手动输入或下拉选择" @select="changeSelect" value-key="bank" :debounce="500" style="width:100%"></el-autocomplete>
  </div>
</template>
<script>
  import api from '../../utils/api'
  import util from '../../utils/util'
  export default {
    name: 'rf-bank',
    props: {
      bankList: { // 列表
        type: Array
      },
      account: { // 银行账户
        type: [Number, String]
      },
      bank: { // 开户行
        type: [Number, String]
      }
    },
    data () {
      return {
        id: this.bid,
        bankStr: this.bank,
        dataList: [] // 列表
      }
    },
    watch: {
      bank (newValue) {
        this.bankStr = newValue
      }
    },
    mounted () {
    },
    methods: {
      changeSelect (value) {
        if (value) {
          this.$emit('update:account', value.account)
          this.$emit('update:bank', value.bank)
        }
      },
      showSelection () {
        if(this.$refs['autoInput'])
          this.$refs['autoInput'].focus()
      },
      getDataList (queryString, cb) {
        this.$emit('update:bank', this.bankStr)
        this.dataList = this.bankList
        if(cb) cb(this.bankList)
      }
    }
  }
</script>

